body {
  :global {
    .filter-select {
      .ant-select-item-option {
        font-size: 12px;
        padding: 5px 8px;
      }
    }

    .filter-select-option {
      font-size: 12px;
      padding: 5px 8px;
    }
  }
}

.filter-field-wrapper {
  margin-bottom: 8px;
  background: #f7f8fc;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #b1b7c3;
  font-weight: 400;
  padding-left: 6px;
  padding-right: 6px;
  border: 1px solid transparent;
  overflow: hidden;
  font-size: 12px !important;
  font-weight: 400;
  letter-spacing: 0px;
  line-height: 17.38px;
  color: rgba(177, 183, 195, 1);
  text-align: left;

  &:last-child {
    margin-bottom: 0;
  }

  &:hover {
    border: 1px solid #0068ff;
  }

  :global {
    .ant-input-affix-wrapper
    {
      border: 0;
      outline: 0;
      box-shadow: none;
      background: transparent;
    }
    .ant-input-affix-wrapper:focus
    {
      border: 0;
      outline: 0;
      box-shadow: none;
      background: transparent;
    }
    .ant-input-affix-wrapper:hover
    {
      border: 0;
      outline: 0;
      box-shadow: none;
      background: transparent;
    }
    i.connector {
      margin: 0 8px;
      display: flex;
      align-items: center;
      &::after {
        content: '-';
      }
    }

    /** reset ant design style */

    .ant-input,
    .ant-select,
    .ant-select-selector,
    .ant-input-number,
    .ant-input-number-input,
    .ant-picker,
    .ant-picker-input,
    .ant-select-single.ant-select:not(.ant-select-customize-input) .ant-select-selector {
      border: none !important;
      box-shadow: none !important;
      background: transparent !important;
      padding-left: 0;
    }
    .ant-select-single.ant-select-show-arrow .ant-select-selection-item,
    .ant-select-single.ant-select-show-arrow .ant-select-selection-placeholder {
      padding-right: 6px;
    }
    .ant-select-multiple.ant-select-show-arrow .ant-select-selector,
    .ant-select-multiple.ant-select-allow-clear .ant-select-selector {
      padding-right: 6px;
    }

    .ant-select-clear {
      right: 18px !important;
    }

    .ant-checkbox-wrapper .ant-checkbox + span {
      font-size: 12px !important;
    }

    .ant-select-arrow {
      right: 0px !important;
    }
    .ant-select-multiple .ant-select-selection-search {
      margin-inline-start: 0;
    }
    .ant-select-multiple .ant-select-selection-placeholder {
      right: 0;
      left: 0;
    }
  }
}

.filter-field-label1 {
  margin-right: 6px;
}

.filter-field-label2 {
    margin-right: 6px;
    color: #333333;
  }

.filter-field-content {
  flex: 1;
  :global {
    .input-bettwen-line {
      display: flex;
      align-items: center;
      margin: 0 8px;
    }
  }
}

.filter-field-suffix {
  height: 100%;
  display: flex;
  align-items: center;
}

.field-focus {
  background: #ffffff;
  border: 1px solid #0068ff;
}
